<template>
  <div>
    <div class="detailTop">
      <div class="contents-tubiao">
        <span class="iconfont">&#xe620;</span>
      </div>
      去哪儿推荐
    </div>
    <ul class="schedule border-bottom">
      <li class="border-bottom" v-for="item of list" :key="item.id">
        <div class="schedule-left">
          <h3>{{item.title}}</h3>
          <div class="left-yuding">
            <img src="https://img1.qunarzz.com/piao/fusion/1804/25/792e9929973a9902.png">
            23:59前可订明日
          </div>
          <div>预订须知</div>
        </div>
        <div class="schedule-right">
          <p>￥{{item.money}}</p>
          <div>{{item.desc}}</div>
        </div>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: 'DetailDetailTop',
  props: {
    list: Array
  }
}
</script>

<style lang="stylus" scoped="scoped">
  div
    background white
  .detailTop
    margin-top 0.2rem
    padding-top 0.2rem
    border-bottom 1px solid #EEEEEE
    padding-bottom 0.2rem
    font-size 0.4rem
    .contents-tubiao
      float left
      background #25A4BB
      margin-left 0.2rem
      width 0.4rem
      height 0.4rem
      text-align center
      border-radius 50%
      margin-right 0.1rem
      span
        color white
  .schedule
    background #F5F5F5
    overflow hidden
    margin-left 0.2rem
    li
      overflow hidden
      background white
    .schedule-left
      float left
      width 60%
      font-size 0.3rem
      h3
        margin 0.2rem auto
      div
        margin-bottom 0.15rem
    .schedule-right
      float left
      width 40%
      p
        margin-top 0.5rem
        color orange
        text-align center
      div
        background orange
        color white
        margin-right 0.2rem
        text-align center
        border-radius 0.06rem
        padding 0.2rem 0
</style>
